<!--
    vue2的回顾
<script>
export default {
  props: {
    value: String
  },
  methods: {
    change () {
      this.$emit('input', '顺溜')
    }
  }
}
</script>
-->

<script lang="ts" setup>
defineProps<{
  // vue3中叫做modelValue
  modelValue: string
  age: number
}>()

const emit = defineEmits<{
  // 事件名字是固定的 update:你传递过来的名字
  (e: 'update:modelValue', val: string): void
  (e: 'update:age', val: number): void
}>()
const change = () => {
  emit('update:modelValue', '顺妞')
  emit('update:age', 21)
}
</script>

<template>
  <div class="">
    child {{ modelValue }} {{ age }}
    <p>
      <button @click="change">change</button>
    </p>
  </div>
</template>

<style scoped></style>
